<extend name="Base/common" />

<block name="style">
	<link rel="stylesheet" type="text/css" href="__PUBLIC__/Api/css/main.css">
</block>

<block name="Content">

<div class="page-group">
    <div class="page page-current">
        <!--排班表-->
        <div class="bar bar-standard bar-footer choose-people-footer">
            <p>
            	<button type="button" id="sure" class="button button-fill button-success disabled">确定</button>
            </p>
        </div>
        <div class="content native-scroll">
            <div class="choose-people">
                <div class="content-padded">
                	<form action="{:U('Worker/orderWorker')}" method="post" id="dataform">
	                    <div class="searchbar">
	                        <div class="search-input">
	                            <label class="icon icon-search" for="search"></label>
	                            <input type="search" id='param' name="param" value="{$param}" placeholder='输入关键字...'>
	                            <input type="hidden" name="data" id="data" value='{$data}'/>
            					<input type="hidden" name="worker_id" id="worker_id" value="{$workerModel['worker_id']}"/>
            					<input type="hidden" name="appointment" id="appointment" value=""/>
	                        </div>
	                    </div>
                    </form>
                </div>
                <!--个人信息-->
                <if condition="!empty($workerModel)">
	                <div class="people-info">
	                    <div class="list-block">
	                        <ul>
	                            <li class="item-content item-link"
	                            	onclick="javascript:window.location.href='{:U('Worker/viewAction', 'worker_id='.$workerModel['worker_id'])}'">
	                                <div class="item-media"><i class="icon icon-f7"></i></div>
	                                <div class="item-inner">
	                                    <div class="item-title">
	                                        <div class="people-pic">
	                                            <img src="{$workerModel['fullpath']|default='./Public/Api/images/zhidingxiaoge-pic.jpg'}">
	                                        </div>
	                                        <div class="people-name">
	                                            <p>{$workerModel['name']}</p>
	                                            <p>
	                                            	<for start="0" end="5">
	                                           	    	<if condition="$workerModel['score']/2 gt $i">
	                                           	    		<img src="__PUBLIC__/Api/images/taoxin.png" alt="">
	                                           	    	</if>
												    </for>
	                                            </p>
	                                            <p>{$workerModel['orders_sum']}单</p>
	                                        </div>
	                                    </div>
	                                    <div class="item-after">
	                                        <div class="people-aptitude">
	                                            <p>工号 : {$workerModel['eid']}</p>
	                                            <p>工种 : {:get_dictionary_enum_name('profession_options', strrchr($workerModel['profession'], ','))}</p>
	                                            <p>工龄 : {$workerModel['work_year']|default='1'}年</p>
	                                        </div>
	                                    </div>
	                                </div>
	                            </li>
	                        </ul>
	                    </div>
	                </div>
	                <div class="scheduling">
	                    <div class="scheduling-title clearfix">
	                        <div>小哥排班表</div>
	                        <div>已过期</div>
	                        <div></div>
	                        <div>已选中</div>
	                        <div></div>
	                        <div>已预约</div>
	                        <div></div>
	                    </div>
	                    <div class="scheduling-info ">
	                        <ul class="scheduling-date clearfix">
	                            <notempty name="dateList">
	   								<volist name="dateList" id="date" key="k">
	                           			<li>
	                           				<input type="hidden" value='{$date["tlist"]}'/>
	                           				<input name="day" type="radio" <if condition="$k eq '1'">checked</if>>
	                           				<span>{$date['timestamp']|date='m/d',###}</span>
	                           			</li>
	                           		</volist>
	                           	</notempty>
	                        </ul>
	                        <ul class="scheduling-time clearfix" id="timeList">
	                        </ul>
	                    </div>
	                </div>
	                <!--btn-->
	                <!-- <div class="content-block sure">
	                    <p><a href="#" class="button button-fill button-success">确定</a></p>
	                </div> -->
	                <div class="order-message content-block">
	                    <p id="msg"></p>
	                </div>
	            <elseif condition="empty($workerModel) AND !empty($param)"/>
	            	
	            	<div class="content-padded"><p>未找到小哥信息</p></div>
               	</if>
            </div>
        </div>
    </div>
</div>

</block>

<block name="script">
<script type="text/javascript">

$(function () {

	$("input[name='day']").on('change', viewTime);
	$("input[name='appointment']").live('change', function(){
		
		var timestamp = $("input[name='appointment']:checked").val();
		var localTime = new Date(timestamp * 1000);
		var year = localTime.getFullYear();
		var month = parseInt(localTime.getMonth()) + 1;
		var date = localTime.getDate();
		
		$("#appointment").val(timestamp);
		$("#msg").html('您预约该小哥的时间为' + year + '/' + month + '/' + date + ' ' + formatHour(timestamp));
		$("#sure").removeClass("disabled");
		$("#sure").on('click', order);
	});
	
	viewTime();
	function viewTime(){
		
		var serialStr = $("input[name='day']:checked").prev().val();
		var hourArray = $.parseJSON(serialStr);
		
		var html = '';
		
		$.each(hourArray, function(key, val){
			
			var disabled = '';
			var ordered = '';
			var checked = '';
			
			if(val['status'] == '1'){
				disabled = ' disabled ';
			}else if(val['status'] == '2'){
				ordered = ' class="ordered" ';
				disabled = ' disabled ';
			}else if(val['status'] == '3'){
				checked = ' checked ';
			}
			
			html += '<li' + ordered + '><input name="appointment" value="' + val['timestamp'] + '" type="radio" ' + disabled + 
					checked + ' ><span>' + formatHour(val['timestamp']) + '</span></li>';
		});
		
		$("#timeList").html(html);
		$("#sure").off('click');
		$("#sure").addClass('disabled');
	}
	
	function formatHour(timeStamp){
		
		var localTime = new Date(timeStamp * 1000);
		var hour = localTime.getHours();

		return hour + ':00';
	}
	
	function order(){
		
		var workerID = $("#worker_id").val();
		var appointment = $("#appointment").val();
		
		if(isNaN(workerID)){
			
			$.alert('请指定小哥');
			return false;
		}else if(isNaN(appointment)){
			$.alert('请选择预约时间');
			return false;
		}
		
		var target = Think.U('Worker/order');
		$("#dataform").attr('action', target);
		$(document).find('form').submit();
	}
});


</script>

</block>

